<template>
  <div class="home">
   
     <router-view> </router-view>
         <!-- <com></com> -->
    <!-- <div class="footer">
      <ul >
        <li v-for="(item, index) in list" :key="index" @click="jump(item)">{{item.title}}</li>
      </ul>
    </div> -->
  </div>
</template>
<script>
export default ({
 name:'App',
 data(){
    return{
      list:[
        {title:'微信',name:'wechat',path:'/home/wechat.vue'},
        {title:'联系人',name:'mail',path:'./mail.vue'},
        {title:'发现',name:'fri',path:'./fri.vue'},
        {title:'我的',name:'my',path:'./my.vue'},
      ]
    }
  },
  methods:{
    jump(item){
      console.log(item)
      this.$router.push({
        name: item.name,
        path: item.path
      })
    },
  }
})
</script>

<style lang="scss">
*{
  margin: 0;
  padding: 0;
}
.footer{
  width: 100%;
  height: 60px;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: indianred;
  ul{
    display: flex;
    justify-content: space-around;
    list-style: none;
    li{
      line-height: 60px;
      width: 25%;
      text-align: center;
    }
  }
}
</style>
